<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>AI 端模型 - 前端开发的时代</title>
</head>
<body>
    <script src="https://cdn.jsdelivr.net/npm/brain.js">
        // 这里src引入brain.js 是引入浏览器端可以运行的神经网络库
    </script>
    <script>
        // json 数组 
        // 输入 input 
        // 以下数组是喂给大模型的数据
        const data = [
            { "input": "implementing a caching mechanism improves performance", "output": "backend" },
            { "input": "hover effects on buttons", "output": "frontend" },
            { "input": "optimizing SQL queries", "output": "backend" },
            { "input": "using flexbox for layout", "output": "frontend" },
            { "input": "setting up a CI/CD pipeline", "output": "backend" },
            { "input": "SVG animations for interactive graphics", "output": "frontend" },
            { "input": "authentication using OAuth", "output": "backend" },
            { "input": "responsive images for different screen sizes", "output": "frontend" },
            { "input": "creating REST API endpoints", "output": "backend" },
            { "input": "CSS grid for complex layouts", "output": "frontend" },
            { "input": "database normalization for efficiency", "output": "backend" },
            { "input": "custom form validation", "output": "frontend" },
            { "input": "implementing web sockets for real-time communication", "output": "backend" },
            { "input": "parallax scrolling effect", "output": "frontend" },
            { "input": "securely storing user passwords", "output": "backend" },
            { "input": "creating a theme switcher (dark/light mode)", "output": "frontend" },
            { "input": "load balancing for high traffic", "output": "backend" },
            { "input": "accessibility features for disabled users", "output": "frontend" },
            { "input": "scalable architecture for growing user base", "output": "backend" }
        ];
        // 初始化一个神经网络
        const network = new brain.recurrent.LSTM();
        // 训练会花很长时间
        network.train(data,{
            iterations: 2000,
            log:true,
            logPeriod: 100
            
        });
        // 执行
        const output = network.run(
            "CSS flex for complex layouts"
        );
        
        console.log(output);

    </script>
    
</body>
</html>